
class Basescene {
    constructor(dom) {
        this.id = (new Date()).getTime();
        this.dom = dom;
        this.divWidth = this.dom.offsetWidth;
        this.divHeight = this.dom.offsetHeight;
        this.scene = new THREE.Scene();
        this.camera = new THREE.PerspectiveCamera(45, this.divWidth / this.divHeight, 1, 2000);
        this.renderer = new THREE.WebGLRenderer({
            alpha: true,
            antialias: true
        });
        this.controls = new THREE.OrbitControls(this.camera, this.renderer.domElement);
        this.init();
        
    }
    init() {
        this.camera.position.set(0, 0, 20);
        this.camera.lookAt(this.scene.position);
        this.renderer.setClearColor(0x222222);
        this.renderer.setSize(this.divWidth, this.divHeight);
        this.dom.appendChild(this.renderer.domElement);
        // this.scene.add(new THREE.AxesHelper(10));
        this.animate();
        this.addLight();
        console.log(this.scene);
    }
    addLight() {
        const light = new THREE.AmbientLight(0xffffff);
        this.scene.add(light);
    }
    render() {
        this.renderer.render(this.scene, this.camera);
        this.autoSetsize();
        this.renderOthrer();
    }
    autoSetsize() {
        this.divWidth = this.dom.offsetWidth;
        this.divHeight = this.dom.offsetHeight;
        this.camera.aspect = this.divWidth / this.divHeight;
        this.camera.updateProjectionMatrix();
        this.renderer.setSize(this.divWidth, this.divHeight);
    }
    animate = () => {
        this.request = requestAnimationFrame(this.animate);
        this.render();
    }    
    renderOthrer() {

    }
    dispose() {
        this.removeSceneChildrens();
        setInterval(() => {
            this.cancelAnimation();
        }, 10);
    }
    cancelAnimation() {
        cancelAnimationFrame(this.request);
    }
    removeSceneChildrens() {
        let len = this.scene.children.length;
        for (let i = 0; i < len; i++) {
            let obj = this.scene.children[0];
            this.scene.remove(obj);
        }
    }

    addPlane() {
        var geometry = new THREE.PlaneGeometry(10,10);
        var material = new THREE.MeshBasicMaterial({ 
            side: THREE.DoubleSide,
            // transparent:true
        });
        this.plane = new THREE.Mesh(geometry, material);
        this.scene.add(this.plane);
        // this.plane.scale.set(3,3,3)
    }
    changeTextureE(texture){
        this.plane.material.map = new THREE.TextureLoader().load(texture)
        this.plane.material.needsUpdate = true  
    }

    changeTextureT(texture){
        this.plane.material.map = new THREE.CanvasTexture(texture)
        this.plane.material.needsUpdate = true  
    }


}






